<template>
    <div>
        <div class="header">
            <el-select class="status-select" v-model="type" size="small">
                <el-option label="全部" value></el-option>
                <el-option v-for="i in typeList" :label="i.label" :value="i.value" :key="i.value"></el-option>
            </el-select>

            <el-input
                placeholder="请输入管理员名称"
                v-model="username"
                clearable
                class="headerinput"
                size="small"
            ></el-input>
            <el-date-picker
                v-model="times"
                type="daterange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                value-format="yyyy-MM-dd"
                @change="handDateChange"
                clearable
                size="small"
                class="picker"
            ></el-date-picker>
            <el-button type="primary" size="small" icon="el-icon-search" @click="getData">搜索</el-button>
        </div>
        <el-table :data="list" style="width: 100%">
            <el-table-column prop="id" label="序号"></el-table-column>
            <el-table-column prop="title" label="标题"></el-table-column>
            <el-table-column prop="description" label="描述"></el-table-column>
            <el-table-column prop="type" label="操作类型">
                <template slot-scope="scope">
                    <span>{{scope.row.type | getTypeLabel}}</span>
                </template>
            </el-table-column>
            <el-table-column prop="source" label="来源"></el-table-column>
            <el-table-column prop="username" label="管理员"></el-table-column>

            <el-table-column prop="addTime" label="时间" width="250" align="center"></el-table-column>
        </el-table>
        <div v-if="list.length" class="pagination">
            <el-pagination
                @current-change="handleCurrentChange"
                :current-page="page.num"
                :page-size="page.size"
                layout="total, prev, pager, next"
                :total="page.total"
            ></el-pagination>
        </div>
    </div>
</template>

<script>

const typeList = [
    { label: '添加', value: 101 },
    { label: '编辑', value: 102 },
    { label: '删除', value: 103 },
    { label: '通过审核', value: 201 },
    { label: '拒绝审核', value: 202 },
    { label: '赠券', value: 301 },
    { label: '赠花粉', value: 302 },
    { label: '转款', value: 303 },
]
import * as request from "@/api/system";
export default {
    data() {
        return {
            type: '',
            username: '',
            typeList,
            times: '',
            addtime: '',
            endtime: '',
            page: {
                size: 10,
                num: 1,
                total: 0,
            },
            list: [],
        };
    },
    filters: {
        getTypeLabel(val){
            let str = ''
             typeList.forEach(i => {
                 if(i.value === val) {
                     str = i.label
                 }
            })
            return str
        }
    },
    mounted() {
        this.getData();
    },

    methods: {
        handDateChange() {
            if (this.times) {
                this.addtime = this.times[0] + ' 00:00:00'
                this.endtime = this.times[1] + ' 23:59:59'
            } else {
                this.addtime = ''
                this.endtime = ''
            }
        },
        handleCurrentChange(val) {
            this.page.num = val
            this.getData()
        },
        async getData() {
            let params = {
                type: this.type,
                username: this.username,
                addtime: this.addtime,
                endtime: this.endtime,
                num: this.page.num,
                size: this.page.size,
            };
            try {
                const { errno, data, errmsg } = await request.getLog(params);
                if (errno === 0) {
                    this.list = data.list || []
                    this.page.num = data.pageNum
                    this.page.total = data.total
                } else {
                    this.$message.warning(errmsg)
                }
            } catch (err) {
                console.error(err);
            }
            this.dialog = false;
        },
    }
};
</script>
<style scoped>
.header {
    padding: 30px 30px 20px;
    display: flex;
}
.headerinput {
    width: 200px;
    margin: 0 10px;
}
.picker {
    margin-right: 10px;
}
.pagination {
    margin: 25px 0;
    text-align: center;
}
</style>
